<!doctype html>
<html lang="en">
<head>
    <title>Code coverage report for src/components/Engine/FrameworkAPP/ItemEngine.vue</title>
    <meta charset="utf-8" />
    <link rel="stylesheet" href="..\..\..\..\prettify.css" />
    <link rel="stylesheet" href="..\..\..\..\base.css" />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <style type='text/css'>
        .coverage-summary .sorter {
            background-image: url(..\..\..\..\sort-arrow-sprite.png);
        }
    </style>
</head>
<body>
<div class='wrapper'>
  <div class='pad1'>
    <h1>
      <a href="..\..\..\..\index.html">All files</a> / <a href="index.html">src/components/Engine/FrameworkAPP</a> ItemEngine.vue
    </h1>
    <div class='clearfix'>
      <div class='fl pad1y space-right2'>
        <span class="strong">0% </span>
        <span class="quiet">Statements</span>
        <span class='fraction'>0/78</span>
      </div>
      <div class='fl pad1y space-right2'>
        <span class="strong">0% </span>
        <span class="quiet">Branches</span>
        <span class='fraction'>0/50</span>
      </div>
      <div class='fl pad1y space-right2'>
        <span class="strong">0% </span>
        <span class="quiet">Functions</span>
        <span class='fraction'>0/28</span>
      </div>
      <div class='fl pad1y space-right2'>
        <span class="strong">0% </span>
        <span class="quiet">Lines</span>
        <span class='fraction'>0/78</span>
      </div>
    </div>
  </div>
  <div class='status-line low'></div>
<pre><table class="coverage">
<tr><td class="line-count quiet">1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306</td><td class="line-coverage quiet"><span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-no">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span>
<span class="cline-any cline-neutral">&nbsp;</span></td><td class="text"><pre class="prettyprint lang-js">&lt;template&gt;
  &lt;div v-if="source.data.id &amp;&amp; source.data.cellData" class="OctopusAppItem"&gt;
&lt;!--            {{source.data.cellData}}--&gt;
    &lt;van-cell-group class="Content"&gt;
      &lt;van-cell v-for="cell in source.data.cellData" v-if="cell.show" :key="cell.Name"&gt;
        &lt;template slot="title"&gt;
          &lt;o-app-control v-if="status" v-bind="{data:cell}" v-bind:changed="change"
                         v-model="cell.defaultValue"&gt;&lt;/o-app-control&gt;
        &lt;/template&gt;
      &lt;/van-cell&gt;
    &lt;/van-cell-group&gt;
&nbsp;
    &lt;van-tabbar class="Operation" :fixed="true"&gt;
      &lt;van-tabbar-item name="home"&gt;
        &lt;template v-for="button in source.button"&gt;
          &lt;van-button :type="button.class" v-on:click="button.click"&gt;{{button.text}}&lt;/van-button&gt;
        &lt;/template&gt;
        &lt;template&gt;
          &lt;van-button type="info" v-if="saved" v-on:click="save"&gt;提交&lt;/van-button&gt;
        &lt;/template&gt;
      &lt;/van-tabbar-item&gt;
    &lt;/van-tabbar&gt;
  &lt;/div&gt;
  &lt;div v-else&gt;Octopus APP Framework Initialization Exception.&lt;/div&gt;
&lt;/template&gt;
&nbsp;
&lt;script&gt;
  export default {
    name: 'ItemEngine', /* 这个name暂时不知道用啥用，根据官方文档说的是方便排错的 */
<span class="fstat-no" title="function not covered" >    data() {</span>
<span class="cstat-no" title="statement not covered" >      return {</span>
        octopus: this.$parent.octopus,
        status: true,
        dataExtend: null,
      }
    },
<span class="fstat-no" title="function not covered" >    created: function () {</span>
<span class="cstat-no" title="statement not covered" >      this.init();</span>
<span class="cstat-no" title="statement not covered" >      this.octopus.tips.debug("[" + this.source.data.id + "] AppItemEngine执行了created事件。");</span>
    },
    // 只会执行一次
<span class="fstat-no" title="function not covered" >    mounted: function () {</span>
      // this.$nextTick(function () {
      //   this.octopus.tips.debug("[" + this.source.data.id + "] ItemEngine执行了$nextTick");
      // });
      // this.octopus.tips.debug("[" + this.source.data.id + "] ItemEngine执行了mounted事件。");
    },
<span class="fstat-no" title="function not covered" >    beforeUpdate: function () {</span>
      // this.octopus.tips.debug("[" + this.source.data.id + "] ItemEngine执行了beforeUpdate事件。");
    },
<span class="fstat-no" title="function not covered" >    updated: function () {</span>
<span class="cstat-no" title="statement not covered" >      this.octopus.tips.debug("[" + this.source.data.id + "] AppItemEngine执行了updated事件。");</span>
    },
    // 活动事件，写在这里的好处是不管是第一次创建还是后退回来，都会触发这个事件
    // 比较典型的就是列表组件，返回的时候往往是需要刷新的。
<span class="fstat-no" title="function not covered" >    activated: function () {</span>
<span class="cstat-no" title="statement not covered" >      this.load();</span>
      // this.$nextTick(function () {
      //   this.octopus.tips.debug("[" + this.source.data.id + "] ItemEngine执行了activated.$nextTick事件。");
      // });
<span class="cstat-no" title="statement not covered" >      this.octopus.tips.debug("[" + this.source.data.id + "] AppItemEngine执行了activated事件。");</span>
    },
    // 组件停用时，也就是切换出去的时候，需要注意的是，Item组件切换出去，不允许缓存，需要释放到初始状态，以便于下次进来。
<span class="fstat-no" title="function not covered" >    deactivated: function () {</span>
<span class="cstat-no" title="statement not covered" >      this.destroyData();</span>
<span class="cstat-no" title="statement not covered" >      this.octopus.tips.debug("[" + this.source.data.id + "] AppItemEngine执行了deactivated事件。");</span>
    },
    computed: {
      // 如果cellData数据发生了改变,则触发这个事件。
<span class="fstat-no" title="function not covered" >      changeCell: function () {</span>
<span class="cstat-no" title="statement not covered" >        return this.source.id;</span>
      },
<span class="fstat-no" title="function not covered" >      changePage: function () {</span>
&nbsp;
      }
    },
    methods: {
      // 执行加载
<span class="fstat-no" title="function not covered" >      load: function (type) {</span>
        // 满足要求才执行查询
<span class="cstat-no" title="statement not covered" >        if (this.source.data.id &amp;&amp; this.source.data.cellData) {</span>
          // 设置请求加载类型，默认查询。
<span class="cstat-no" title="statement not covered" >          this.source.data.type = type || "SELECT";</span>
&nbsp;
<span class="cstat-no" title="statement not covered" >          let o = this;</span>
          // 对数据进行八爪鱼脚本过滤（前端配置的代码，因为后台只要有八爪鱼代码，就会在后台处理掉。）
          // 主要是解析#{param=xxx},#{control=xxx}的数据
<span class="cstat-no" title="statement not covered" >          this.source.data.value = this.octopus.tools.parseScript(this.source.data.value);</span>
          // // 八爪鱼数据源编辑页、列编辑页不执行替换语义
          // if (this.octopus.router.get().fullPath.indexOf("Engine/Datasource/Modify") == -1) {
          //   // 解析cell判斷是否存在默认值需要转义，此处主要针对前端代码设置绑定的转义。
          //   // 如果是后台配置，非前端代码，则这个函数是没有必要存在的。
<span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >          $(this.source.data.cellData).each(function (index, cell) {</span></span>
            // 查询模式下，需要清空默认值，否则会有缓存。
<span class="cstat-no" title="statement not covered" >            if (o.source.data.type == "SELECT") {</span>
              // 为了防止缓存，每次进来都需要把值清空，请求以后重新赋值。
<span class="cstat-no" title="statement not covered" >              cell.defaultValue = null;</span>
            }
          });
&nbsp;
&nbsp;
          // 后面多级下拉框的实现逻辑就是遍历item的数据库配置，如果发现有联动属性，则追加动态监听，即可实现动态联动。
          // if (type != "SELECT") {
          //   console.log(JSON.stringify(this.source.data));
          // }
&nbsp;
          // 请求后台八爪鱼API框架。
<span class="cstat-no" title="statement not covered" >          this.octopus.request.api.post("/Octopus/Engine/Item", this.source.data,</span>
            // 处理回调事件，通过分析data.status.code的状态来实现。
<span class="fstat-no" title="function not covered" >            function (data) {</span>
<span class="cstat-no" title="statement not covered" >              if (data.status.code == 200) {</span>
                // Item控件具备属性验证，这里追加validate属性，默认验证通过，控件初始化时会自动
<span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >                $(data.content.cellData).each(function (index, cell) {</span></span>
<span class="cstat-no" title="statement not covered" >                  cell.validate = true;</span>
<span class="cstat-no" title="statement not covered" >                  if(o.source.model){</span>
<span class="cstat-no" title="statement not covered" >                    cell.model = "VIEW";</span>
                  }else {
<span class="cstat-no" title="statement not covered" >                    cell.model = "ITEM";</span>
                  }
                  ////////////////////////  列关联数据处理，支持关联多个父级，但是mapping需要列不同 //////////////////////
<span class="cstat-no" title="statement not covered" >                  if (cell.link) {</span>
<span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >                    $(cell.link).each(function (linkIndex, linkData) {</span></span>
                      // 查找当前关联列是否存在
<span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >                      let bindingData = $.grep(data.content.cellData, function (item) {</span></span>
<span class="cstat-no" title="statement not covered" >                        return item.name == linkData.binding;//筛选出当前数据列数据</span>
                      });
                      // alert(JSON.stringify(linkColumn));
<span class="cstat-no" title="statement not covered" >                      if (bindingData.length == 1) {</span>
                        // 赋值
<span class="cstat-no" title="statement not covered" >                        linkData.value = bindingData[0].defaultValue;</span>
                      }
                    });
                  }
                });
&nbsp;
                // 更新对象，前提是值不一致，如果一致则不更新，更新到最底层。
                // o.octopus.tools.updateObject(o.source.data, data.content);
                // 新增属性，需要使用$set，详细参考：https://blog.csdn.net/panyang01/article/details/76665448
                // console.log(JSON.stringify(data.content));
&nbsp;
<span class="cstat-no" title="statement not covered" >                o.$set(o.source, "data", data.content);</span>
&nbsp;
                // 100毫秒以后触发Tips、Control组件，节约性能，之前在组件内部每个控件创建一次比较浪费资源。
<span class="cstat-no" title="statement not covered" >                o.octopus.tips.render();</span>
&nbsp;
<span class="cstat-no" title="statement not covered" >                if (o.source.data.type == "SELECT") {</span>
<span class="cstat-no" title="statement not covered" >                  if (o.loaded) {</span>
<span class="cstat-no" title="statement not covered" >                    o.loaded(data);</span>
                  }
<span class="cstat-no" title="statement not covered" >                } else if (o.source.data.type == "UPDATE" || o.source.data.type == "CREATE") {</span>
<span class="cstat-no" title="statement not covered" >                  if (o.saved) {</span>
<span class="cstat-no" title="statement not covered" >                    o.saved(data);</span>
                  }
                }
              } else {
<span class="cstat-no" title="statement not covered" >                o.octopus.tips.error(data);</span>
              }
&nbsp;
            });
        }
      },
      // 完全彻底的刷新控件的方法。
<span class="fstat-no" title="function not covered" >      reload: function () {</span>
<span class="cstat-no" title="statement not covered" >        let o = this;</span>
<span class="cstat-no" title="statement not covered" >        this.status = false;</span>
<span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >        this.$nextTick(function () {</span></span>
<span class="cstat-no" title="statement not covered" >          o.status = true;</span>
<span class="cstat-no" title="statement not covered" >          o.load();</span>
        });
      },
<span class="fstat-no" title="function not covered" >      validate: function () {</span>
<span class="cstat-no" title="statement not covered" >        let o = this;</span>
<span class="cstat-no" title="statement not covered" >        let status = true;</span>
<span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >        $(this.source.data.cellData).each(function (index, cell) {</span></span>
          // 找到一个false就弹出。
<span class="cstat-no" title="statement not covered" >          if (!cell.validate) {</span>
<span class="cstat-no" title="statement not covered" >            status = false;</span>
<span class="cstat-no" title="statement not covered" >            o.octopus.tips.error("列：" + cell.displayName + " 数据不合法，请输入合规数据以后再试。");</span>
<span class="cstat-no" title="statement not covered" >            return status;</span>
          }
        });
        // 验证回调事件，给开发者在保存前最后一次外部干预的机会。
<span class="cstat-no" title="statement not covered" >        if (this.validated) {</span>
<span class="cstat-no" title="statement not covered" >          status = this.validated(status);</span>
        }
<span class="cstat-no" title="statement not covered" >        return status;</span>
      },
<span class="fstat-no" title="function not covered" >      save: function () {</span>
        // 此处执行数据轮询验证，就是查看validate是否都为true，因为主体验证都是有控件本身完成的。
<span class="cstat-no" title="statement not covered" >        if (this.validate()) {</span>
          // 执行更新或插入
<span class="cstat-no" title="statement not covered" >          if (this.source.data.value) {</span>
<span class="cstat-no" title="statement not covered" >            this.load("UPDATE");</span>
          } else {
<span class="cstat-no" title="statement not covered" >            this.load("CREATE");</span>
          }
        }
      },
      // 暂时没想到打印怎么实现。。
      // print: function (index) {
      //
      // },
<span class="fstat-no" title="function not covered" >      back: function () {</span>
        // 如果存在则回调返回函数。
<span class="cstat-no" title="statement not covered" >        if (this.backed) {</span>
<span class="cstat-no" title="statement not covered" >          this.backed();</span>
        }
      },
<span class="fstat-no" title="function not covered" >      init: function () {</span>
<span class="cstat-no" title="statement not covered" >        this.initData();</span>
      },
      // 初始化数据，主要是还原#param等预设参数，重新绑定。
<span class="fstat-no" title="function not covered" >      initData: function () {</span>
        // 是否需要缓存，Item组件默认是拒绝缓存，否则第二次进来就是上次的保存值，所有的初始化参数设置都会被覆盖，导致异常。
<span class="cstat-no" title="statement not covered" >        this.source.cache = this.source.cache || false;</span>
        // 保存整体控件，给后续引用方法，调用使用，极其方便。
<span class="cstat-no" title="statement not covered" >        this.source.control = this;</span>
        // data数据深拷贝用，默认null，只有当Cache为false时，会用到这个对象，用于在第一次加载时保存开发者配置的数据。
        // 以便于每次进入时像第一次进入一下进行解码、换算，绑定，渲染事件，
<span class="cstat-no" title="statement not covered" >        this.source.dataExtend = this.source.dataExtend || null;</span>
&nbsp;
        // 如果禁止缓存，则在创建时拷贝原始source对象，组件注销时还原。
<span class="cstat-no" title="statement not covered" >        if (!this.source.cache) {</span>
          // 执行JQ浅拷贝（只复制顶层的非 object 元素）
          // var newObject = jQuery.extend({}, oldObject);
          // 执行JQ深拷贝，也就拷贝data数据，因为这个是会变的，其他的cache、control等属性是组件内置，外围可配，但都是开发者定义的。
<span class="cstat-no" title="statement not covered" >          this.dataExtend = $.extend(true, {}, this.source.data);</span>
        }
      },
      // 组件停用时把data修正回原始数据，其他属性因为不会变，所以不用还原。
<span class="fstat-no" title="function not covered" >      destroyData: function () {</span>
        // 如果禁用缓存，则停止组件时还原初始化Source配置数据源。
<span class="cstat-no" title="statement not covered" >        if (!this.source.cache) {</span>
<span class="cstat-no" title="statement not covered" >          this.source.data = $.extend(true, {}, this.dataExtend);</span>
        }
      },
      // 控件数据变更事件
<span class="fstat-no" title="function not covered" >      change: function (new_cell, old_cell) {</span>
<span class="cstat-no" title="statement not covered" >        let o = this;</span>
        // 处理关联数据
<span class="cstat-no" title="statement not covered" >        setLinkData(new_cell.name, new_cell.defaultValue);</span>
&nbsp;
        // 递归处理
<span class="fstat-no" title="function not covered" >        function setLinkData(linkName, linkValue) {</span>
          // 列关联数据处理，支持关联多个父级，但是mapping需要列不同
<span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >          $(o.source.data.cellData).each(function (index, cell) {</span></span>
<span class="cstat-no" title="statement not covered" >            if (cell.link) {</span>
<span class="cstat-no" title="statement not covered" ><span class="fstat-no" title="function not covered" >              $(cell.link).each(function (linkIndex, linkData) {</span></span>
<span class="cstat-no" title="statement not covered" >                if (linkData.binding == linkName) {</span>
                  // 赋值
<span class="cstat-no" title="statement not covered" >                  linkData.value = linkValue;</span>
<span class="cstat-no" title="statement not covered" >                  cell.defaultValue = null;</span>
                  // 判断当前控件是否是其他控件的父亲，如果是则同步处理。
<span class="cstat-no" title="statement not covered" >                  setLinkData(cell.name, cell.defaultValue);</span>
                }
              });
            }
          });
        }
&nbsp;
<span class="cstat-no" title="statement not covered" >        if (this.changed) {</span>
<span class="cstat-no" title="statement not covered" >          this.changed(new_cell, old_cell);</span>
        }
      },
    },
    watch: {
      // 监听器需要记住所有需要替换的控件值？可是如果被替换了，还需要按照格式替换么。
      // 'source.cache': function (newv, oldv){
      //   alert('11111');
      // },
      // // 只要data.value发生变化，则必须重新渲染控件，因为该值是主键，一切的根本。
      // 'source.data.value': function (newv, oldv) {
      //   // 禁止不等于、为空、或者第一次加载带解析符号 &amp;&amp; oldv.indexOf("#") == -1
      //   if (newv != oldv &amp;&amp; !this.octopus.tools.IsNullOrEmpty(newv)) {
      //     // 触发数据改变时间，回调函数。
      //     if (this.changed) {
      //       this.changed();
      //     }
      //   }
      // },
      // 深度监听（观察者模式），可监听由父组件改变的对象状态
      // 'source.data.cellData': {
      //   handler(newValue, oldValue) {
      //     //父组件param对象改变会触发此函数
      //     console.log("=====new,deep,");
      //   },
      //   deep: true
      // },
      // // 监听计算属性的变化
      // changeCell: function (newval, oldval) {
      //   console.log("changeCell:\nOLD: " + JSON.stringify(oldval) + "\n\nNEW: " + JSON.stringify(newval));
      // }
    },
    props: ["source", "loaded", "validated", "saved", "changed", "backed"]
  }
&nbsp;
&lt;/script&gt;
&nbsp;
/*  scoped的意思是这里的样式只对当前页面有效不会影响其他页面，还有可以设置lang="scss"就是支持css预编译，也就是支持sass或者less  */
&lt;!-- Add "scoped" attribute to limit CSS to this component only --&gt;
&lt;style scoped&gt;
  h1, h2 {
    font-weight: normal;
  }
&lt;/style&gt;
&nbsp;</pre></td></tr>
</table></pre>
<div class='push'></div><!-- for sticky footer -->
</div><!-- /wrapper -->
<div class='footer quiet pad2 space-top1 center small'>
  Code coverage
  generated by <a href="https://istanbul.js.org/" target="_blank">istanbul</a> at Mon Jan 20 2020 17:54:15 GMT+0800 (GMT+08:00)
</div>
</div>
<script src="..\..\..\..\prettify.js"></script>
<script>
window.onload = function () {
        if (typeof prettyPrint === 'function') {
            prettyPrint();
        }
};
</script>
<script src="..\..\..\..\sorter.js"></script>
</body>
</html>
